---
id: 5ef9b03c81a63668521804ea
title: 步驟 65
challengeType: 0
dashedName: step-65
---

# --description--

請注意，到目前爲止你添加到頁面的所有內容都在 `body` 元素內。 應該呈現到頁面的所有頁面內容元素都放在 `body` 元素中。 但是，其他重要信息位於 `head` 元素中。

The `head` element is used to contain metadata about the document, such as its title, links to stylesheets, and scripts. Metadata is information about the page that isn't displayed directly on the page.

在 `body` 元素上方添加一個 `head` 元素。

# --hints--

你刪除了 `body` 元素，或者它缺少開始標籤或結束標籤。

```js
assert(document.querySelector('body') && code.match(/<\/body>/));
```

你的 `head` 元素應該有一個開始標籤。 開始標籤的書寫語法爲：`<elementName>`。

```js
assert(code.match(/\<head\>/));
```

你的 `head` 元素應該有一個閉合標籤。 結束標籤在 `<` 字符之後有一個 `/`。

```js
assert(code.match(/\<\/head\>/));
```

你的 `head` 元素應位於 `body` 元素開始標籤的上方。 你把它放在別的地方了。

```js
const noSpaces = code.replace(/\s/g, '');
assert(noSpaces.match(/\<\/head\>\<body\>/));
```

# --seed--

## --seed-contents--

```html
--fcc-editable-region--
<html>

  <body>
--fcc-editable-region--
    <main>
      <h1>CatPhotoApp</h1>
      <section>
        <h2>Cat Photos</h2>
        <!-- TODO: Add link to cat photos -->
        <p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
      </section>
      <section>
        <h2>Cat Lists</h2>
        <h3>Things cats love:</h3>
        <ul>
          <li>cat nip</li>
          <li>laser pointers</li>
          <li>lasagna</li>
        </ul>
        <figure>
          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
        </figure>
        <h3>Top 3 things cats hate:</h3>
        <ol>
          <li>flea treatment</li>
          <li>thunder</li>
          <li>other cats</li>
        </ol>
        <figure>
          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
        </figure>
      </section>
      <section>
        <h2>Cat Form</h2>
        <form action="https://freecatphotoapp.com/submit-cat-photo">
          <fieldset>
            <legend>Is your cat an indoor or outdoor cat?</legend>
            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
          </fieldset>
          <fieldset>
            <legend>What's your cat's personality?</legend>
            <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label>
            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label>
          </fieldset>
          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
          <button type="submit">Submit</button>
        </form>
      </section>
    </main>
    <footer>
      <p>
        No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a>
      </p>
    </footer>
  </body>
</html>
```

